<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link href="css/styles.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="js/jquery.js"></script>
    </head>
    <body>
        <div id="background">
            <!-- tiling image of the blue gradient at the top -->
            <div id="centre">
                <!-- splats and stars -->
                <div id="water_sand">
                    <!-- the tiling water and sand wave along the bottom -->
                    <div id="bottom">
                        <!--this is the underwater scene -->
                        <div id="wrapper">
                            <div id="header">
                                <div id="logo_birds">
                                    <div id="logo_container">
                                        <div id="logo"><img src="images/logo.png" width="262" height="64" alt="Logo" /></div>
                                    </div>
                                    <div class="left"></div>
                                    <div class="right"></div>
                                </div>
                                <!--end logo birds-->
                                <div id="search_blimp">
                                    <div class="front"><img src="images/search_blimp.png" width="213" height="63" alt="Search" /></div>
                                    <div class="middle">
                                        <div class="button">
                                            <input name="search_button" type="image" src="images/button_search.gif"/>
                                        </div>
                                        <div class="field">
                                            <input name="search" type="text" />
                                        </div>
                                    </div>
                                    <div class="tail"></div>
                                </div>
                                <!--end search blimp-->
                            </div>
                            <!--end header-->
                            <div id="menu_wrapper">
                                <div id="main_menu">
                                    <ul>
                                        <li><a href="index.jsp">home</a></li>
                                        <li><a href="products.html">products</a></li>
                                        <li> <a href="about.html">about</a></li>
                                        <li><a href="terms_faq.html">terms &amp; faq</a></li>
                                        <li class="noborder"><a href="contact.html">contact</a></li>
                                    </ul>
                                </div>
                                <!--end main menu-->
                                <div id="cart">
                                    <div class="left"></div>
                                    <div class="icon"><img src="images/icon_cart.png" width="33" height="31" alt="Cart" /></div>
                                    <ul class="text">
                                        <li><a href="#">0 items</a> <span class="white">|</span></li>
                                        <li><a href="#">$0.00</a> <span class="white">|</span></li>
                                        <li><a href="#">Checkout</a></li>
                                    </ul>
                                    <div class="right"></div>
                                </div>
                                <!--end cart-->
                            </div>
                            <!--end menu wrapper-->
                            <div id="container">
                                <div class="top"></div>
                                <div id="content">
                                    <div class="home_left">
                                        <p><a href="#"><img src="images/home_main_photo.jpg" alt="Home Main" width="688" height="193" border="0" class="home_large_image" /></a></p>
                                        <h1>Welcome to Kids Toys</h1>
                                        <form action="CustomerController" method="post">
                                            Username: <input type="text" name="txtUsername" value="" /><br/>
                                            Password: <input type="text" name="txtPassword" value="" /><br/>
                                            <input type="submit" value="Login" name="btAction" />
                                        </form>


                                    </div>
                                    <!--end home left-->
                                    <div class="home_right">
                                        <ul class="home_boxes">
                                            <li><a href="#"><img src="images/home_view_catalogue.jpg" alt="Latest Catalogue" width="244" height="193" border="0" /></a></li>
                                            <li><a href="#"><img src="images/home_terms.jpg" alt="Terms and FAQ" width="243" height="193" border="0" /></a></li>
                                            <li><a href="#"><img src="images/home_delivery.jpg" alt="Home Delivery" width="244" height="193" border="0" /></a> </li>
                                        </ul>
                                    </div>
                                    <!--end home right-->
                                    <hr class="clear" />
                                </div>
                                <!--end content-->
                            </div>
                            <!--end main container-->
                            <div id="container_bottom"></div>

                        </div>
                        <!--end wrapper-->
                    </div>
                    <!--end bg pattern-->
                </div>
            </div>
        </div>

    </body>
</html>
